<template>
  <div>
    <div>
      <div class="font15 mt10 pl10">
        <span class="titletext ">{{ titledata.title }}</span>
        <div class="graytext  mt10 font13">
          <span>工单编号：</span>
          <span class="titletext">{{ titledata.pmInsId }}</span>
        </div>
      </div>
      <div class="mt10" style=" display: flex;border-bottom: 1px solid #ebedf0;">
        <div class="blue_item" />
        <span class="font15" style="display: flex; line-height: 33px;margin-left:5px;  flex:1;">开标关联数据</span>
      </div>
      <van-field readonly required name="projectName" :value="fromdata.projectName" label="项目名称：" label-width="5em" />
      <van-field readonly required name="city" :value="fromdata.city" label="地市：" label-width="3em" />
      <van-field v-if="fromdata.city != '省重要客户中心'" :right-icon="canEditcountiesPick ? 'arrow' : ''" readonly required
        name="counties" :value="fromdata.counties" label="县区：" label-width="3em"
        @click="canEditcountiesPick == true ? getCountyByParentOrgCode() : ''" :rules="[{ required: canEditcountiesPick, message: '请选择县区' }]"/>
      <van-popup v-model="showcountiesPick" position="bottom" get-container="body">
        <van-picker show-toolbar :columns="showcountiesPickcolumns" @confirm="showcountiesPickonConfirm"
          @cancel="showcountiesPick = false" />
      </van-popup>
      <van-field readonly required name="biddingPeople" :value="fromdata.biddingPeople" label="招标人：" label-width="4em" />
      <van-field readonly required name="biddingAgency" :value="fromdata.biddingAgency" label="招标代理机构："
        label-width="7em" />
      <van-field readonly required name="purchasingMethod" :value="fromdata.purchasingMethod" label="采购方式："
        label-width="5em" />
      <van-field readonly name="biddingBudget" :value="fromdata.biddingBudget" label="招标预算(元)：" label-width="7.5em" />
      <van-field readonly name="winServiceCharge" :value="fromdata.winServiceCharge" label="中标服务费（元）："
        label-width="9em" />
      <van-field readonly required name="winPeople" :value="fromdata.winPeople" label="中标人：" label-width="4em" />
      <van-field readonly required name="winDate" :value="fromdata.winDate" label="中标日期：" label-width="5em" />
      <van-field readonly required name="winMoney" :value="fromdata.winMoney" label="中标金额(万元)：" label-width="8.5em" />
      <van-field readonly required name="winPeopleModel" :value="fromdata.winPeopleModel" label="中标人模型："
        label-width="6em" />
      <van-field v-if="fromdata.winPeopleModel!='中国联通'&&fromdata.winPeopleModel!='中国电信'" readonly required name="winType" :value="fromdata.winType" label="中标类型：" label-width="5em" />
      <van-field readonly required name="announcementUrl" :value="fromdata.announcementUrl" label="公告链接："
        label-width="5em" />
      <van-field readonly required name="industryAttribution" :value="fromdata.industryAttribution" label="一级行业归属："
        label-width="7em" />
      <van-field readonly required name="dataSources" :value="fromdata.dataSources" label="数据来源：" label-width="5em" />
      <van-field readonly required name="dataTime" :value="fromdata.dataTime" label="数据时间：" label-width="5em" />
      <van-field readonly required name="processLimited" :value="fromdata.processLimited" label="处理时限："
        label-width="5em" />
      <van-field readonly required name="isSpecialCaseArchive" :value="fromdata.isSpecialCaseArchive" label="是否特殊情况归档："
                 label-width="9em" />
      <van-field readonly required name="isClaimValue" :value="fromdata.isClaimValue" label="是否认领(地市公司)："
        label-width="10.5em" @click="showdishiPick1 = (canEditdishi == true) ? true : false" :right-icon="canEditdishi ? 'arrow' : ''" :rules="[{ required: canEditdishi, message: '请选择是否认领' }]"/>
      <van-popup v-model="showdishiPick1" position="bottom" get-container="body">
        <van-picker show-toolbar :columns="showdishiPick1columns" @confirm="showdishiPick1onConfirm"
          @cancel="showdishiPick1 = false" />
      </van-popup>
      <van-field v-if="showNodishi1Filed == true" :readonly="canEditdishi!=true" required autosize type="textarea" rows="1"
        name="isClaimDescription" :value="fromdata.isClaimDescription" v-model="fromdata.isClaimDescription" label="非本地市项目说明：" label-width="9em" :rules="[{ required: showNodishi1Filed, message: '请填写说明' }]" :right-icon="canEditdishi ? 'arrow' : ''"/>
      <van-field readonly required name="isOperateCity" :value="fromdata.isOperateCity" label="是否公司经营范围内项目(地市公司)："
        label-width="12em" @click="showdishiPick2 = (canEditdishi == true) ? true : false" :right-icon="canEditdishi ? 'arrow' : ''" :rules="[{ required: canEditdishi, message: '请选择是否公司经营范围' }]"/>
      <van-popup v-model="showdishiPick2" position="bottom" get-container="body">
        <van-picker show-toolbar :columns="showdishiPick2columns" @confirm="showdishiPick2onConfirm"
          @cancel="showdishiPick2 = false" />
      </van-popup>
      <van-field v-if="showNodishi2Filed == true" :readonly="canEditdishi!=true" required autosize type="textarea" rows="1"
        name="isOperateCityExplain" :value="fromdata.isOperateCityExplain" v-model="fromdata.isOperateCityExplain" label="是否公司经营范围内项目(地市公司)说明："
        label-width="12em" :rules="[{ required: showNodishi2Filed, message: '请填写说明' }]" :right-icon="canEditdishi ? 'arrow' : ''"/>
      <van-field v-if="showxianquValue == true &&fromdata.city!= '省重要客户中心'" readonly required name="isClaimCountyValue"
        :value="fromdata.isClaimCountyValue" label="是否认领(县区公司)：" label-width="10.5em"
        @click="showxianquPick1 = (canEditxianqu == true) ? true : false" :right-icon="canEditxianqu ? 'arrow' : ''" :rules="[{ required: canEditxianqu, message: '请选择是否认领'}]"/>
     
      <van-field v-if="showNoxianqu1Filed == true && showxianquValue == true &&fromdata.city!= '省重要客户中心'" :readonly="canEditxianqu!=true" required autosize type="textarea"
        rows="1" name="isClaimCountyDescription" :value="fromdata.isClaimCountyDescription" v-model="fromdata.isClaimCountyDescription" label="非本县区项目说明："
        label-width="9em" :rules="[{ required: showNoxianqu1Filed, message: '请填写说明' }]" :right-icon="canEditxianqu ? 'arrow' : ''"/>
      <van-field v-if="showxianquValue == true&&fromdata.city!= '省重要客户中心'" readonly required name="isOperateCounties"
        :value="fromdata.isOperateCounties" label="是否公司经营范围内项目(县区公司)：" label-width="12em"
        @click="showxianquPick2 = (canEditxianqu == true) ? true : false" :right-icon="canEditxianqu ? 'arrow' : ''" :rules="[{ required: canEditxianqu, message: '请选择是否公司经营范围'}]"/>
      <van-popup v-model="showxianquPick2" position="bottom" get-container="body">
        <van-picker show-toolbar :columns="showxianquPick2columns" @confirm="showxianquPick2onConfirm"
          @cancel="showxianquPick2 = false" />
      </van-popup>
      <van-field v-if="showxianquValue == true && showNoxianqu2Filed == true&&fromdata.city!= '省重要客户中心'" :readonly="canEditxianqu!=true" required autosize type="textarea"
        rows="1" name="isOperateCountiesExplain" :value="fromdata.isOperateCountiesExplain" v-model="fromdata.isOperateCountiesExplain" label="是否公司经营范围内项目(县区公司)说明："
        label-width="12em" :rules="[{ required: showNoxianqu2Filed, message: '请填写说明' }]" :right-icon="canEditxianqu ? 'arrow' : ''"/>
      <van-field  readonly required name="isInformatization" :value="fromdata.isInformatization" label="是否包含信息化应用服务（IT）："
        label-width="12em" />
      <van-field v-if="fromdata.isInformatization == '否'" readonly required autosize type="textarea" rows="1"
        name="isInformatizationExplain" :value="fromdata.isInformatizationExplain" label="是否包含信息化应用服务（IT）说明："
        label-width="12em" />
      <div v-if="showcChengbanView == true" class="mt10" style=" display: flex;border-bottom: 1px solid #ebedf0;">
        <div class="blue_item" />
        <span class="font15" style="display: flex; line-height: 33px;margin-left:5px;  flex:1;">审批</span>
      </div>
      <van-field v-if="showcChengbanView == true" readonly required name="auditResults" :value="fromdata.auditResults"
        label="审核结果：" label-width="5em" @click="showChengbanPick = (showcChengbanView == true&&todotype==true) ? true : false" :right-icon="showcChengbanView&&todotype==true ? 'arrow' : ''"/>
       <van-popup v-model="showxianquPick1" position="bottom" get-container="body">
        <van-picker show-toolbar :columns="showxianquPick1columns" @confirm="showxianquPick1onConfirm"
          @cancel="showxianquPick1 = false" />
      </van-popup>
     
      <van-field v-if="showcChengbanView == true" :readonly="todotype!=true" autosize type="textarea" rows="1" name="auditOpinion" v-model="fromdata.auditOpinion"
        :value="fromdata.auditOpinion" label="审核意见：" label-width="5em" :right-icon="showcChengbanView&&todotype==true? 'arrow' : ''"/>
         <van-popup v-model="showChengbanPick" position="bottom" get-container="body">
        <van-picker show-toolbar :columns="showChengbanPickcolumns" @confirm="showChengbanPickonConfirm"
          @cancel="showChengbanPick = false" />
      </van-popup>  
      <div v-if="yidongzhongbiao == false && showcChengbanView == true">
        <van-field readonly required name="isPunish" :value="fromdata.isPunish" label="是否处罚或免责：" label-width="8em" />
        <van-field readonly required autosize type="textarea" rows="1" name="punishReason" :value="fromdata.punishReason"
          label="处罚或免责原因：" label-width="8em" />
        <van-field v-show="fromdata.isPunish == '是'" readonly required name="punishNumber" :value="fromdata.punishNumber"
          label="处罚公文文号：" label-width="7em" />
        <van-field v-show="fromdata.isPunish == '是'" readonly required name="punishPeople" :value="fromdata.punishPeople"
          label="处罚人员：" label-width="5em" />
        <van-field v-show="fromdata.isPunish == '是'" readonly required autosize type="textarea" rows="1"
          name="punishDetails" :value="fromdata.punishDetails" label="处罚详情：" label-width="5em" />
        <van-field required v-show="fromdata.isPunish == '是'" label-width="10em" readonly label="处罚公文文件:" class="lyy-width"
          input-align="left" placeholder=""></van-field>
        <div v-show="fromdata.isPunish == '是'" v-for="(fileitem) in fromdata.punishFileList" :key="fileitem.id"
          style="margin-left:20px">
          <div readonly class="font14 fileLink" style="color:#0F85CF">
            <a target="_blank" @click="openFileUrlfun(fileitem.anonymousFilePath)">{{ fileitem.fileName }}</a>
          </div>
        </div>
        <van-field required v-show="fromdata.isPunish == '是'" label-width="10em" readonly label="处罚依据:" class="lyy-width"
          input-align="left" placeholder=""></van-field>
        <div v-show="fromdata.isPunish == '是'" v-for="(fileitem) in fromdata.punishBasisFile" :key="fileitem.id"
          style="margin-left:20px">
          <div readonly class="font14 fileLink" style="color:#0F85CF">
            <a target="_blank" @click="openFileUrlfun(fileitem.anonymousFilePath)">{{ fileitem.fileName }}</a>
          </div>
        </div>
      </div>
      <historyAndSuggs id='target' :showHistory='showHistory' :historydata='historydata' :approveList='approveList' />
    </div>
  </div>
</template>
 
<script>
import { getCountyByParentOrgCode } from '@/api/dictapi'
import { openFileUrl } from '@/store/openFile'
import historyAndSuggs from "@/views/srqr/historyAndSuggs.vue"
import { mapGetters } from "vuex"
export default {
  data() {
    return {
      canEditdishi:false,
      showxianquValue:false,
      canEditxianqu:false,
      showdishiPick1:false,
      showdishiPick1columns:['认领(本公司客户)','不认领(非本公司客户)'],
      showNodishi1Filed:false,
      showdishiPick2:false,
      showdishiPick2columns:['是','否'],
      showNodishi2Filed:false,
      showxianquPick1:false,
      showxianquPick1columns:['认领(本县区客户)','不认领(非本县区客户)'],
      showNoxianqu1Filed:false,
      showxianquPick2:false,
      showxianquPick2columns:['是','否'],
      showNoxianqu2Filed:false,
      yidongzhongbiao:false,
      showcountiesPick :false,
      showcountiesPickcolumns:[],
      countiesList:[],
      canEditcountiesPick:false,
      showcChengbanView:true,
      changeFromdata:{},
      hasSetdata:false,
      showChengbanPick:false,
      showChengbanPickcolumns:['通过','不通过'],

    }
  },
  computed: {
    ...mapGetters(['user']),
  },
  props: ['location','todotype','titledata','businessdata','fromdata','showHistory','historydata','approveList'],
  created() {
  },
  watch: {
    fromdata: {
      handler() { //这是vue的规定写法，当你watch的值发生变化的时候，就会触发这个handler，这是vue内部帮你做的事情
        console.log('changeFromdata list changed')
        this.$emit('freshData',this.fromdata)
        if (this.hasSetdata==false){
          if((this.location=='dict.startToSecondAdmin'||this.location=='dict.startToSecondAdminTrun')&&this.todotype==true){
            this.canEditdishi=true;
            if (this.fromdata.city!='省重要客户中心'){
              this.canEditcountiesPick=true;  
            }else{
              this.canEditcountiesPick=false;  
            }
          }else{
            this.canEditdishi=false;
          }
          if(this.fromdata.city!='省重要客户中心'&&this.location!='dict.startToSecondAdmin'&&this.location!='dict.startToSecondAdminTrun'&&(this.location=='dict.secondAdminToThreeAdmin'||this.location=='dict.secondAdminToDepartmentInterior'
          ||this.location=='dict.startSpecialToIndustryLead'||this.location=='dict.leadToSecondAdmin'||this.fromdata.businessName)){
            this.showxianquValue=true;
            if(this.fromdata.dataSources=='分公司导入'){
              this.canEditxianqu=false
              this.fromdata.isClaimCounty='认领';
              this.fromdata.isOperateCounties='是';
            }else{
              if(this.todotype==true&&(this.location=='dict.secondAdminToDepartmentInterior'
          ||this.location=='dict.startSpecialToIndustryLead')){
                console.log('11x1111111x1111x1111')
                this.canEditxianqu=true
              }
            }
          }else{
            this.canEditxianqu=false;
          }
          if(this.fromdata.isClaim=='认领'){
            this.fromdata.isClaimValue='认领(本公司客户)';
            this.showNodishi1Filed=false;
          }else if(this.fromdata.isClaim=='不认领'){
            this.fromdata.isClaimValue='不认领(非本公司客户)';
            this.showNodishi1Filed=true;
          }
          if(this.fromdata.isOperateCity=='是'){
            this.showNodishi2Filed=false;
          }else if(this.fromdata.isOperateCity=='否'){
            this.showNodishi2Filed=true;
          }
          if(this.fromdata.isClaimCounty=='认领'){
            this.fromdata.isClaimCountyValue='认领(本县区客户)';
            this.showNoxianqu1Filed=false
          }else if(this.fromdata.isClaimCounty=='不认领'){
            this.fromdata.isClaimCountyValue='不认领(非本县区客户)';
            this.showNoxianqu1Filed=true
          }
          if(this.fromdata.isOperateCounties=='是'){
            this.showNoxianqu2Filed=false;
          }else if(this.fromdata.isOperateCounties=='否'){
            this.showNoxianqu2Filed=true;
          }
          
          if(this.fromdata.winPeopleModel=='中国移动'||this.fromdata.winPeopleModel=='集成商'){
            console.log('是否移动中标111111111'+this.fromdata.winPeopleModel)
            this.yidongzhongbiao=true;
          }else {
            console.log('是否移动中标22222222'+this.fromdata.winPeopleModel)
            this.yidongzhongbiao=false;
          }
          if((this.location!='dict.start'&&this.location!='dict.startNoBelong'
          &&this.location!='dict.startToSecondAdmin'&&this.location!='dict.startToSecondAdminTrun')
          &&!(this.location=='dict.secondAdminToThreeAdmin'||this.location=='dict.secondAdminToDepartmentInterior'||this.location=='dict.startSpecialToIndustryLead')
          &&(this.location=='dict.specialLeadToSecondAdminTrun'||this.location=='dict.specialLeadToSecondAdmin'
          ||this.location=='dict.departmentInteriorToLead'||this.location=='dict.leadToSecondAdmin'
          ||this.location=='dict.managementLeadToOneAdmin'||this.location=='dict.oneAdminTurn'
          ||this.location=='dict.oneAdminToTurn'||this.location=='dict.secondAdminToTurn'
          ||this.location=='dict.threeAdminToLead'||this.location=='dict.departmentInteriorToAdmin'
          ||this.location=='dict.leadToManagementLead'||this.fromdata.isEmphasis!=null)){
            this.showcChengbanView=true;  
          }else{
            this.showcChengbanView=false;
          }
        }
        this.$emit('freshData', this.fromdata)
      },
      deep: true,  // 可以深度检测到 obj 对象的属性值的变化
      immediate: true //刷新加载  立马触发一次handler
    },
  },
  methods: {
    tomsg() {
      document.getElementById('target').scrollIntoView({ behavior: 'smooth' })
    },
    getCountyByParentOrgCode(){
      this.hasSetdata=true;
      getCountyByParentOrgCode({ parentOrgCode: this.fromdata.citiesCode } ,{ userName: this.user.userName })
        .then((result) => {
          if (!result.data) {
            Notify(result.message);
            return;
          }
          this.showcountiesPickcolumns = [];
          this.countiesList = [];
          for (var i = 0; i < result.data.data.length; i++) {
            this.showcountiesPickcolumns.push(result.data.data[i].ORGNAME);
          }
          this.countiesList = result.data.data;
          this.showcountiesPick = true;
        })
    },
    showcountiesPickonConfirm(value, index) {
      console.log('修改了县区')
      this.hasSetdata=true;
      this.fromdata.countiesCode=this.countiesList[index].ORGCODE;
      this.fromdata.counties=value;
      this.showcountiesPick=false;
    },
    showdishiPick1onConfirm(value){
      this.hasSetdata=true;
      this.fromdata.isClaimValue=value;
      if(value == '认领(本公司客户)'){
          this.fromdata.isClaim='认领';
          this.showNodishi1Filed=false;
      }else if(value == '不认领(非本公司客户)'){
          this.fromdata.isClaim='不认领';
          this.showNodishi1Filed=true
      }
      this.showdishiPick1=false;
    },
    showdishiPick2onConfirm(value){
      this.hasSetdata=true;
      this.fromdata.isOperateCity=value;
      if(value == '是'){
        this.showNodishi2Filed=false;
      }else if(value == '否'){
        this.showNodishi2Filed=true
      }
      this.showdishiPick2=false;
    },
    showxianquPick1onConfirm(value){
      this.hasSetdata=true;
      this.fromdata.isClaimCountyValue=value;
      if(value == '认领(本县区客户)'){
          this.fromdata.isClaimCounty='认领';
          this.showNoxianqu1Filed=false
      }else if(value == '不认领(非本县区客户)'){
          this.fromdata.isClaimCounty='不认领';
          this.showNoxianqu1Filed=true
      }
      this.showxianquPick1=false;
    },
    showxianquPick2onConfirm(value){
      this.hasSetdata=true;
      this.fromdata.isOperateCounties=value;
      if(value == '是'){
        this.showNoxianqu2Filed=false;
      }else if(value == '否'){
        this.showNoxianqu2Filed=true
      }
      this.showxianquPick2=false;
    },
    showChengbanPickonConfirm(value){
      this.fromdata.auditResults=value;
      this.showChengbanPick=false
    },
    openFileUrlfun(value) {
      this.$router.push(
        {
          name: 'fileview',
          query: {
            openFileUrl: openFileUrl(value)
          }
        }
      );
    },
  },
  components: {
    historyAndSuggs
  },
}
</script>
 
<style>.tables.el-table .cell {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
  word-break: break-all;
  line-height: 15px;
  padding-left: 5px;
  padding-right: 5px;
}</style>